<div class="padding-bottom-45">
  <div class="modal-header">
    <div class="modal-title">{{ title }}</div>
  </div>
  <form nz-form [formGroup]="form" #validateForm="ngForm" (ngSubmit)="save()" *ngIf="dataDictionary">
    <nz-form-item nz-row>
      <nz-form-label nz-col [nzSm]="5" [nzXs]="24" nzRequired>组名</nz-form-label>
      <nz-form-control [nzSm]="19" nzHasFeedback>
        {{ group.name }}
      </nz-form-control>
    </nz-form-item>
    <nz-form-item *ngIf="group.mode == 2" nz-row>
      <nz-form-label nz-col [nzSm]="5" [nzXs]="24" nzRequired>父级</nz-form-label>
      <nz-form-control [nzSm]="19" nzHasFeedback>
        {{ parent? parent.desc : '一级分类' }}
      </nz-form-control>
    </nz-form-item>
    <nz-form-item *ngIf="group.mode != 3" nz-row>
      <nz-form-label nz-col [nzSm]="5" [nzXs]="24" nzRequired>名称</nz-form-label>
      <nz-form-control [nzSm]="19" [nzErrorTip]="errorDescTpl" nzHasFeedback>
        <input nz-input formControlName="desc" placeholder="请输入名称" [(ngModel)]="dataDictionary.desc" />
        <ng-template #errorDescTpl let-control>
          <ng-container *ngIf="control.hasError('required')">
            名称不能为空!
          </ng-container>
          <ng-container *ngIf="control.hasError('maxLength')">
            名称不能超过100个字符!
          </ng-container>
        </ng-template>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item nz-row>
      <nz-form-label nz-col [nzSm]="5" nzRequired [nzXs]="24">代码</nz-form-label>
      <nz-form-control [nzSm]="19" [nzErrorTip]="errorCodeTpl" nzHasFeedback>
        <input nz-input formControlName="code" placeholder="请输入代码" [(ngModel)]="dataDictionary.code" />
        <ng-template #errorCodeTpl let-control>
          <ng-container *ngIf="control.hasError('required')">
            名称不能为空!
          </ng-container>
          <ng-container *ngIf="control.hasError('maxLength')">
            代码必须大于0小于25个字符!
          </ng-container>
          <ng-container *ngIf="control.hasError('repeat')">
            同一组代码不能重复!
          </ng-container>
        </ng-template>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item *ngIf="group.mode == 3" nz-row>
      <nz-form-label nz-col [nzSm]="5" [nzXs]="24" nzRequired>配置值</nz-form-label>
      <nz-form-control [nzSm]="19" [nzErrorTip]="errorValueTpl" nzHasFeedback>
        <input nz-input formControlName="value" placeholder="请输入配置值" [(ngModel)]="dataDictionary.value" />
        <ng-template #errorValueTpl let-control>
          <ng-container *ngIf="control.hasError('required')">
            名称不能为空!
          </ng-container>
          <ng-container *ngIf="control.hasError('maxLength')">
            配置值必须大于0小于100个字符!
          </ng-container>
        </ng-template>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item *ngIf="group.mode == 3" nz-row>
      <nz-form-label nz-col [nzSm]="5" [nzXs]="24" nzRequired>配置说明</nz-form-label>
      <nz-form-control [nzSm]="19" [nzErrorTip]="errorDescTpl" nzHasFeedback>
        <input nz-input formControlName="desc" placeholder="请输入配置说明" [(ngModel)]="dataDictionary.desc" />
        <ng-template #errorDescTpl let-control>
          <ng-container *ngIf="control.hasError('maxLength')">
            配置说明不能超过100个字符!
          </ng-container>
        </ng-template>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item nz-row>
      <nz-form-label nz-col [nzSm]="5" [nzXs]="24" nzRequired>排序</nz-form-label>
      <nz-form-control [nzSm]="19" [nzErrorTip]="errorSeqTpl" nzHasFeedback>
        <input nz-input formControlName="seq" placeholder="请输入排序" [(ngModel)]="dataDictionary.seq" />
        <ng-template #errorSeqTpl let-control>
          <ng-container *ngIf="control.hasError('pattern')">
            排序必须为数字!
          </ng-container>
        </ng-template>
      </nz-form-control>
    </nz-form-item>
    <div class="modal-footer">
      <button nz-button type="button" [disabled]="saving" (click)="close()">
        取消
      </button>
      <button nz-button [nzType]="'primary'" type="submit" [disabled]="!validateForm.valid || saving">
        保存
      </button>
    </div>
  </form>
</div>